import axios from 'axios'
import { Message } from 'element-ui'
// 导入路由实例
import router from '@/router'
import store from '@/store'
// import { getToken } from '@/utils/auth'
// 通过axios.create方法创建了一个新axios实例并配置后台基础地址
// 说明❓：service和axios用法一样
const service = axios.create({
  // 动态配置后台请求的基地址
  /**
   * 为什么使用环境变量动态配置后台请求的地址？
   * 之前写法：写死的地址baseURL=“请求地址”
   * 环境：1.开发环境（npm run dev）2.生成环境（npm run build）
   * 不同环境可以配置不同的环境变量使用
   * 因为在实际企业开发中，开发环境和生成环境使用的后台地址是不一样的
   * 例如：开发的时候使用的ip地址，上线了使用正式的域名地址
   */
  baseURL: process.env.VUE_APP_BASE_API // url = base url + request url
})
// 1. 请求拦截器=》发请求之前执行
service.interceptors.request.use(
  config => {
    // config是配置项，包括headers
    // console.log(store)
    if (store.getters.token) {
      // 场景：统一添加请求头=》把token加入到请求中
      config.headers.Authorization = `Bearer ${store.getters.token}`
    }
    return config
  },
  error => {
    // do something with request error
    console.log(error) // for debug
    return Promise.reject(error)
  }
)

// 2. 响应拦截器 =》请求响应了执行
service.interceptors.response.use(
  response => {
    /**
     * 后台返回的数据先经过这里，返回之后，页面才能获取返回的值
     * 页面中的请求只要的是data部分
     *
     */
    // 状态码2xx 走到这里
    // 简化返回的数据
    const { data, message, success } = response.data
    if (success) {
      return data
    } else {
      // 使用饿了么组件提示
      // Message.error(message)
      // 对外抛出请求错误
      return Promise.reject(new Error(message))
    }
  },
  error => {
    // 状态码2xx以外
    // console.log('err' + error) // for debug
    // 场景：如果token失效了，状态码 401，删除token重新登录
    console.dir(error)
    /**
 * token失效处理：
 * 1.判断请求的状态码等于401
 * 2.删除token和用户信息
 * 3.跳回登录面
 */
    if (error.response.status === 401) {
      /**
       * 问题：页面中多个请求401.造成多次跳转登录页，登录成功后不能跳回上次访问的页面
       * 解决：判断已经跳转登录面，就return下
       * router.currentRoute.path 获取当前访问的页面最新的地址
       */
      if(router.currentRoute.path === '/login') return
      Message.error(error.response.data.message)
      store.dispatch('user/logoutAction')
      // replace也是跳转页面，能替换当前页面，但是不能返回上次页面
      // router.replace('/login')
      // 需求: 满足用户重新登录后，返回上次访问的页面
      // 携带用户正在访问的页面地址=》怎么获取？= router.currentRoute.path
      router.push(`/login?backUrl=${router.currentRoute.path}`)
    }
    return Promise.reject(error)
  }
)
export default service
